<template>
  <view class="service-home">
    <view class="service-home-title"
      ><text class="title-text">社区服务</text></view
    >
    <view class="service-home-content">
      <view class="service-home-content-item" @click="servicePageTo('/pages/home/service/PropertyPay')">
        <text class="iconfont icon-wuyejiaofei item-icon"></text>
        <view class="item-text">物业缴费</view>
      </view>
      <view
        class="service-home-content-item"
        @click="servicePageTo('/pages/home/service/TemperatureReport')"
      >
        <text class="iconfont icon-thermometer item-icon"></text>
        <view class="item-text">测温上报</view>
      </view>
      <view class="service-home-content-item" @click="servicePageTo('/pages/home/service/EpidemicNews/EpidemicNews')">
        <text class="iconfont icon-xinwen item-icon"></text>
        <view class="item-text">疫情新闻</view>
				
      </view>
      <view class="service-home-content-item" @click="servicePageTo('/pages/home/service/QuestionNaire/QuestionNaire')">
        <text class="iconfont icon-wenjuantoupiao item-icon"></text>
        <view class="item-text">社区问卷</view>
      </view>
      <view class="service-home-content-item" @click="servicePageTo('/pages/home/service/PreventionKnowledges/PreventionKnowledges')">
        <text class="iconfont icon-zhishi item-icon"></text>
        <view class="item-text">防疫知识</view>
      </view>
      <view class="service-home-content-item" @click="servicePageTo('/pages/home/service/GroupBuying/ShopHome')">
        <text class="iconfont icon-pintuangou item-icon"></text>
        <view class="item-text">社区团购</view>
      </view>
      <view class="service-home-content-item" @click="servicePageTo('/pages/home/service/Complaint/Complaint')">
        <text class="iconfont icon-tousu item-icon"></text>
        <view class="item-text">投诉</view>
      </view>
      <view class="service-home-content-item"  @click="servicePageTo('/pages/home/service/ReportRepair/ReportRepair')">
        <text class="iconfont icon-wenjuantoupiao item-icon"></text>
        <view class="item-text">报修</view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    servicePageTo(url) {
      uni.navigateTo({ url: url });
    },
  },
};
</script>

<style lang="scss">
@import "@/static/styles/mixin.scss";
.service-home {
  width: 100%;

  box-sizing: border-box;
  background-color: $uni-color-indexBg;
  .service-home-title {
    padding: 0 20rpx;
    padding-top: 20rpx;
    .title-text {
      font-size: 45rpx;
      color: #4cd964;
    }
  }
  .service-home-content {
    display: flex;
    font-size: 27rpx;
    flex-wrap: wrap;
    color: #666666;
    .service-home-content-item {
      flex: 0 0 33.3%;
      padding: 25rpx 0;
      // overflow: hidden;

      // @include center;
      .item-icon {
        font-size: 50rpx;
        @include center;
      }
      .item-text {
        @include center;
      }
    }
  }
}
</style>
